---
title: "Accessibility Checker Rule Help: Rpt_Aria_ContentinfoWithNoMain_Implicit"
---
import "../../../styles/ToolHelp.scss"
import { CodeSnippet, Tag } from "carbon-components-react";

<div className="toolHelp">
<Row>
<Column colLg={16} colMd={8} colSm={4} className="toolHead">

### A element with `"contentinfo"` role is present without an element with a `"main"` role

<div id="locLevel"></div>

A element with `"contentinfo"` role is only permitted with an element with `"main"` role

</Column>
</Row>
<Row>
<Column colLg={11} colMd={5} colSm={4} className="toolMain">

### Why is this important?

A element with `"contentinfo"` role is an area that identifies common information at the bottom of each page, typically called the footer of the page. It includes information such as copyrights and links to privacy and accessibility statements. A footer without any main content within a `"main"` role is not permitted. The HTML `<footer>` element has an implicit role of `"contentinfo"` when it is a direct descendent of the `<body>` element.

<div id="locSnippet"></div>

### What to do

* Add a `<main>` element that has an implicit role of `"main"` to enclose the main content of the Web page.


For example:

<CodeSnippet type="multi" light={true}>&lt;body&gt;
    &lt;div role="main"&gt;
      ...
    &lt;/div&gt;
    &lt;div role="contentinfo"&gt;
	    ...
    &lt;/div&gt;
&lt;/body&gt;</CodeSnippet>

</Column>
<Column colLg={5} colMd={3} colSm={4} className="toolLeft">

### About this requirement

[IBM 2.4.1 Bypass Blocks](https://www.ibm.com/able/requirements/requirements/#2_4_1)
[WAI-ARIA 1.2 Contentinfo Role](https://www.w3.org/TR/wai-aria-1.2/#contentinfo)

### Who does this affect?

* Blind people using screen readers

</Column>
</Row>
</div>

export default ({ children, _frontmatter }) => (<React.Fragment>{children}</React.Fragment>)
